Javascript es un lenguaje de archivos de comandos (scripts) basado en objetos, desarrollado por Netscape. Su estructura es comparable con la de C o C++. Javascript se integra en un documento HTML y se interpreta por el navegador. Los programas pueden reaccionar ante acciones del usuario lo que hace dinámicos a los documentos web. Además, Javascript pone en manos del desarrollador web un enorme potencial de control y de incremento en la flexibilidad del contenido de la web. Contenidos definidos por el usuario, representación visual mejorada y una más sencilla integración de los plug ins del navegador convierten a Javascript en una excelente herramienta con la que se ensamblan, en una unidad informativa cerrada, las distintas partes de un documento web.
Es una lenguaje de programación no tan complicado (estricto) como C++ o Pascal. Por su flexibilidad y escasez de reglas se le considera un lenguaje script (o lenguaje de archivos de comandos).
No existe una definición exacta de esta expresión. Se utiliza para aludir a la posibilidad, integrada en diversas aplicaciones, de crear macros (subrutinas o "programas"). Es un tipo de lenguaje de programación que, siendo relativamente sencillo y dotado de pocas reglas y preceptos, permite agregar pequeñas unidades funcionales a las aplicaciones, o simplificar y automatizar la ejecución de las funciones en sí.
Así como WordBasic amplía la capacidad funcional de Word, Javascript hace lo mismo con una página Web estándar. Debe de quedar claro que la funcionalidad se agrega a la página Web en cuestión, no así al navegador. Un documento HTML en el que se utilice Javascript ofrece más posibilidades que un documento HTML corriente, pero el navegador no gana por ello funcionalidad.
La diferencia entre los lenguajes orientados a objetos y los basados en objetos radica en que los primeros ofrecen la posibilidad de definir objetos. Un lenguaje basado en objetos es un lenguaje con una colección de objetos. Estos objetos están, por tanto, integrados en el lenguaje.
Siempre que sucede algo en una página Web, se produce un evento: la pulsación de un botón, el movimiento del puntero del ratón sobre un elemento, la carga de una página, etc. La forma en que Javascript responda a dichos eventos dependerá de lo que se haya programado.
Javascript está diseñado para poder representar y manipular la información mediante y en el navegador. No se puede escribir un programa en Javascript que lea un directorio en un ordenador o que lo borre. En cambio si se puede crear un archivo de comandos que supervise y grabe la sesión del uso de su navegador, que acumule o guarde en un archivo lógico las paginas que ha visitado y los datos que ha introducido (formas).
Javascript no tiene dependencia funcional bajo niguna plataforma y sólo está vinculado al navegador que lo interpreta. Por ello se pueden encontrar diferencias entre los distintos navegadores.
Javascript de Netscape no es Java de Sun y tiene poco que ver con él, menos de los que su nombre permite suponer. Ambos trabajan en el mismo entorno -la WWW- y ambos son adecuados para crear aplicaciones de internet que, incrustadas en una página HTML, son ejecutadas por el navegador. Entre Netscape y Sun solo existen acuerdos en lo que respecta a la seguridad de ambos productos, pero se desarrollan de forma independiente.
Ni Javascript es un subconjunto de Java ni viceversa, ambos son entidades diferentes. En ciertos aspectos presentan algunas similitudes, pero persiguen objetivos distintos:
| Javascript | Java |
|---|---|
| Se interpreta por el cliente | Se compila por el programador y se ejecuta por el cliente |
| El código está incrustado en HTML | El código (applet) se carga como módulo |
| Utilización sencilla de datos/tipos de datos | Reglas muy estrictas para los tipos de datos |
| Código sólo utilizable en documentos HTML | Permite la creación de programas independientes |
| Colabora con elementos HTML | Supera las capacidades de HTML |
| Posibilita el acceso directo a los objetos del navegador | Carece de acceso a los objetos del navegador y a su funcionalidad |
| Basado en objetos: se pueden utilizar los objetos integrados, pero carece de creación de clases y de herencia | Orientado a objetos: los applets constan de clases con herencia |
| Vínculo dinámico: las referencias de objetos se verifican en tiempo de ejecución | Vínculo estático: las referencias de objetos tienen que estar establecidas ya al efectuarse la compilación |
Este primer ejemplo muestra cómo incrustar archivos de comandos en un documento HTML. Pasos del ejemplo:
Aquí se han agregado un par de líneas antes y después de la instrucción de Javascript. Con esto se logra "ocultar" el código de Javascript de navegadores que no lo soportan.
Observe que el propio código <script> se encuentra fuera de la instrucción de comentario, ya que, de no ser así, también habría sido interpretado como tal y no se hubiera ejecutado la instrucción.
Tenga en cuenta que Javascript es case sensitive; es decir, distingue entre mayúsculas y minúsculas. Por tal motivo, la instrucción Document.write("¡Hola!") provoca un error debido a que no se ha escrito con minúscula la "D" de Document.
Las funciones no son más que código escrito en Javascript, que figura una o varias veces dentro de un documento, pero que, por razones de simplificación, se escribe una sola vez.
Ejemplo 3Este ejemplo muestra cómo definir y llamar funciones de javascript. Pasos del ejemplo:
Note que el código de la función se encuentra encerrado entre llaves. Al igual que cualquier otro código Javascript, una función puede emplazarse en cualquier punto dentro del documento HTML, aunque se recomienda ponerlas al principio del mismo.
La ejecución de un archivo de comandos Javascript se realiza según el denominado procedimiento Top-Down o secuencial. Esto quiere decir que una función, o cualquier otro código, sólo se podrá utilizar si antes ya se ha declarado.
Los elementos de diálogo son la clave para lograr una fácil interacción con el usuario en general, siendo esto aplicable no sólo a los formularios. La utilización de elementos de diálogo también sirve, generalmente, para satisfacer requisitos más exigentes. Por ello Javascript permite la utilización de cualquier elemento de diálogo en documentos HTML, y esto puede hacerse de forma sencilla.
Ejemplo 4En este ejemplo se ha integrado un botón que, al ser pulsado, ejecuta una función Javascript. Pasos del ejemplo:
El tratamiento del evento onClick se ocupa de realizar la llamada a la función cuando se pulse el botón.
Este ejemplo no contiene código en Javascript, solo se proporciona como referencia de los elementos de diálogo con los que cuenta HTML.
Ejemplo 6Al principio del documento, en la sección <HEAD>, se ha añadido una breve función de Javascript que, de la forma más sencilla y con la ayuda de la función alert(), provoca la salida del nombre del elemento de diálogo correspondiente. Además, a cada elemento de diálogo HTML se le ha añadido una llamada a la función, o mejor dicho, un tratamiento del suceso que invoca la función verifica() cuando se va a activar el elemento de diálogo correspondiente.
Los tratamientos de eventos son muy prácticos. Se utilizan para reaccionar ante determinados eventos, sin tener que estar supervisando permanentemente a la espera de que pase algo (también llamado polling). Esto significa que la aparición de un evento produce la interrupción de un programa (o código HTML) para que se reaccione a esta situación con un comando de Javascript.
Tales eventos pueden ser, entre otros:
Aquí se muestra el tratamiento de tres eventos distintos. Pasos del ejemplo:
En la programación, cada objeto recibe un nombre (con objeto se alude, en este caso, a cada elemento de un programa, como variables, funciones, etc,, no sólo a los objetos relacionados con la programación orientada a objetos en sí). Como programador, podrá utilizar casi todo para la creación de los nombres. En lugar del término Nombre, en la programación se utiliza el término identificador.
Los identificadores se definen, por regla general, en la declaración de las variables en el momento de crearlas:
Existen ciertas limitaciones en la utilización de identificadores. Así, por ejemplo, no podrá utilizar ninguna palabra reservada, así como tampoco podrá colocar una cifra (carácter numérico) como primer carácter de un identificador.cantidad = 50;Nombre = "Huber";o en la definición de funciones:function prueba(){ //Aquí se encuentra el código de la función }o en la creación de nuevos objetos:nuevoObjeto = new Date();
Cuando en un programa se trabaja con datos e informaciones, llegará un momento en el que se deseará guardar temporalmente esos datos o durante toda la ejecución del programa con intención de reutilizarlos. Para tal fin se utilizan las denominadas variables.
Las variables pueden ser de distintos tipos según su alcance o vigencia dentro del programa (rango de aplicación): local o global (públicas).
Ejemplo 8Por rango de aplicación se entiende el rango dentro de un programa en el que una variable es utilizable. El rango de validez de una variable local es muy limitado y, generalmente, sólo alcanza la sección principal de una función. Las variables globales mantienen su validez dentro de todo el programa. En este ejemplo las variables x e y son locales, es decir, que si intentase utilizarlas fuera de la función, se recibiría un mensaje de error. A la inversa las variables s y b se podrían utilizar fuera de la función, ya que han sido declaradas globales.
En muchos casos se desearía controlar la ejecución de un programa bajo determinadas circunstancias, como por ejemplo ante el resultado de un cálculo. Para tal fin Javascript pone a su disposición una serie de estructuras de manejo de programa y de control.
Ejemplo 9En la función calcula(), que se define al principio del archivo de comandos, se declaran dos variables a las que se les asigna un valor inicial. A la variable s se le asigna la cadena de caracteres que se almacena en la propiedad value del cuadro de entrada de texto.
A continuación se valida si n es mayor que 0 y menor que 5; si se cumple esa condición, se produce la salida del valor de n en un bucle por medio de alert() y simultáneamente se disminuye su valor. Si no se cumple la condición, se muestra un mensaje de advertencia con la ayuda de alert().
Ejemplo 10Este ejemplo contiene un formulario en el que se utilizan todas las posibilidades de las que se han hablado hasta ahora.
La programación orientada a objetos se asemeja mucho a la forma de pensar del hombre y, por ello, ofrece muchas posibilidades. Mientras que en el manejo de los lenguajes de programación procedurales, el buen programador se distingue por su inteligencia abstracta, en la programación orientada o objetos esta facultad no ostenta la máxima prioridad.
La percepción de nuestro entorno consiste en descomponerlo en objetos diferenciables. Eso mismo sucede en los lenguajes de programación de este tipo. Se trabaja con objetos cuyas propiedades y reacciones ante determinadas influencias externas (informaciones) son conocidas.
En Javascript es importante no contemplar los distintos elementos del lenguaje de forma aislada conservando una visión global.
En Javascript, estos objetos (navigator e history) son objetos predefinidos y disponen de determinadas funciones y datos que se pueden utilizar en los archivos de comandos. La propiedad o el método de un objeto se escribe siempre anteponiéndole el identificador del objeto separado por un punto.
Un objeto no es más que una colección de funciones y de datos que, en el propio objeto, se denominan métodos por ser afines a las funciones y propiedades por estar definidas por los propios datos respectivamente.
Javascript dispone de un total de 23 objetos:
En la función leePropiedades() se leen en un bucle las propiedades del objeto que se transfirió como parámetro obj y, junto con un salto de línea, se guardan en la cadena de caracteres result. Esta cadena de caracteres se devuelve a la función como resultado. En la segunda función muestraPropiedades() se invoca a la función leePropiedades() dando como resultado la cadena de caracteres vía document.write().
El objeto Date pone a su disposición diversos mecanismos para la lectura, escritura y cálculo de la fecha y la hora. Sin embargo, antes de que pueda operar con los métodos del objeto Date tendrá que generar un nuevo objeto de este tipo. Porque a diferencia de todos los demás objetos, y en este caso, no podría acceder desde el principio a las informaciones sobre la fecha y la hora.
Con el objeto Math se permitiría, por ejemplo, la instrucción siguiente:document.write(Math.E);Pero si genera la siguiente instrucción:document.write(Date.getdate());
obtendrá el mensaje de error de que getDate() no es una función.
Ejemplo 13Al objeto Date sólo se puede acceder por medio de una variable de este tipo. Ésta se define con la ayuda de la palabra reservada new mediante la cual se genera una nueva instancia de un objeto. Simultáneamente se inicializa el objeto Date. En la inicialización se pueden transferir opcionalmente datos que definen una fecha (no hay ningún parámetro para la fecha o la hora actuales) y una hora determinadas:
dateObjectName = new Date (año, mes, día, horas, minutos, segundos);
El objeto Date no trabaja con fechas anteriores al 1 de enero de 1970.